<template>
  <div class="aboutthreef">
    <div class="shuj">数据</div>
    <div class="aboutmethreez">
      <div class="shujneirong" v-for="(v, i) in aboutme" :key="i" @click="fun()">
        <div class="fonttu">
          <span :class="['iconfont', v.icon]"></span>
        </div>
        <div class="shujitext">
          {{ v.shujitext }}
          <div class="jianto">
            {{ v.jianto }}
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      aboutme: [
        {
          icon: "iconfont icon-tubiao-",
          shujitext: "我的年度目标",
          jianto: ">",
        },
        {
          icon: "iconfont icon-chengjiu",
          shujitext: "我的成就",
          jianto: ">",
        },
        {
          icon: "iconfont icon-shuju",
          shujitext: "我的数据",
          jianto: ">",
        },
        {
          icon: "iconfont icon-wodekecheng",
          shujitext: "我的课程",
          jianto: ">",
        },
        {
          icon: "iconfont icon-zhuanyiluxian",
          shujitext: "我的路线",
          jianto: ">",
        },
        {
          icon: "iconfont icon-gerenziliao",
          shujitext: "个人资料",
          jianto: ">",
        },
      ],
    };
  },
  methods: {
    fun() {
      this.$router.push("/Mubiao")
    }
  },
};
</script>

<style scoped>
.shuj {
  margin-top: 0.3rem;
  margin: auto;
  width: 95%;
  height: 0.4rem;
  font-size: 0.2rem;
  line-height: 0.4rem;
}
.aboutmethreez {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 95%;
  height: 4rem;
  margin: auto;
  border-radius: 0.2rem;
  background: #fff;
}
.shujneirong {
  display: flex;
  align-items: center;
  width: 90%;
  height: 0.6rem;
  border-bottom: 0.01rem solid #d0d0d0;
}
.fonttu {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 0.5rem;
  height: 0.5rem;
}
.fonttu .iconfont {
  font-size: 0.4rem;
  color: #767676;
}
.shujitext {
  display: flex;
  justify-content: space-between;
  width: 3rem;
  height: 0.5rem;
  font-size: 0.25rem;
  line-height: 0.5rem;
}
.jianto {
  width: 0.5rem;
  height: 0.5rem;
  font-size: 0.4rem;
  color: #d6d6d6;
  line-height: 0.5rem;
}
</style>